/**
 * ...
 * @author Thot
 */
 
 
function Sample5()
{
	
	var SCREEN_W = document.getElementById("layer1").width >> 0;
	var SCREEN_H = document.getElementById("layer1").height >> 0;
	var _scope = this;
	var _renderer = null;
	var _lastTime = 0;
	var _fps = 0;
	var _imageLoader = null;
	var _counter = 0; 
	var _tracker = null;
	
	

	this.init = function()
	{
		var layer1 	= new Layer();
		var layer2 	= new Layer();
		var camera 	= new Camera();
		var assets 	= getAssetsLists();
		var max 	= assets.length;
		var i 		= 0;
		
		var x = -1000;
		console.log( x >> 0 );
		
		_renderer 	= new Renderer2D();
		_tracker   	= new MouseTracker(document.getElementById("layer2"));
		
		//camera
		camera.x = 0;
		camera.y = 0;
		camera.z = 0;
		camera.width = SCREEN_W;
		camera.height = SCREEN_H;
		camera.pivotX = SCREEN_W * 0.5;
		camera.pivotY = SCREEN_H * 0.5;
		camera.pivotZ = 0;
		
		//layers
		layer1.displayList = new DisplayList();
		layer2.displayList = new DisplayList();
		
		layer1.canvas = document.getElementById("layer1");
		layer2.canvas = document.getElementById("layer2");
		
		layer1.context = layer1.canvas.getContext("2d");
		layer2.context = layer2.canvas.getContext("2d");
		
		//layer1.sortFunc = Radix.sortByProperty;
		//layer1.sortArgs = ["z"];
		
		layer1.lazy = true;
		
		layer1.name = "background";
		layer2.name = "front";
		
		//boost displayList
		
		var boost = new BSPTree();
		boost.init( 0, 0, 10000, 10000, 0, BSPTree.X_AXIS, null, 10, 100 );
		//layer1.displayList.boost = boost;
		layer1.sorted = false;
		
		
		//render settings
		_renderer.camera = camera;
		_renderer.layers.push( layer1 );
		_renderer.layers.push( layer2 );
		
		//start loading assets
		_imageLoader = new ImageLoader();
		_imageLoader.signal.addListener(  ImageLoader.LOAD_COMPLETE, _scope.completeHandler, _scope );
		_imageLoader.signal.addListener(  ImageLoader.LOAD_PROGRESS, _scope.progressHandler, _scope );
		
		for( i = 0; i < max; i++ )
		{
			_imageLoader.addFile( assets[i], i );
		}
		
		_imageLoader.load();
		
	};
	
	this.buildTextures = function( p_data )
	{
		var prop = "";
		var texture = null;
		var i = 0;
		
		for( prop in p_data )
		{
			texture = new Texture2D();
			texture.id = i;
			texture.data = p_data[prop];
			texture.url = "";
			texture.type = Texture2D.BMP_TEXTURE;
			TextureManager.getInstance().addTexture(texture);
			i++;
		}
	};
	
	
	// loop
	this.completeHandler = function()
	{
		var i = 0;
		var j = 0;
		var spr = null;
		var layer1 = _renderer.layers[0];
		var layer2 = _renderer.layers[1];
		var texture = null;

		
		var group = _renderer.camera.transformGroup;
		group.pivotX = 320;
		group.pivotY = 240;
		group.pivotZ = 0;
		
		this.buildTextures( _imageLoader.getData() );
		
		texture = TextureManager.getInstance().getTextureById(5);
		var mask = TextureManager.getInstance().getTextureById(1).data;
		
		for( i = 0; i < 3; i++ )
		{
			
			for( j = 0; j < 3; j++ )
			{
				
				spr = new Sprite();
				
				spr.textureId = texture.id;
				spr.sx = 0;
				spr.sy = 0;
				spr.sw = texture.data.width;
				spr.sh = texture.data.height;
				spr.x = j * 120 + 100;
				spr.y = ( i % 3 ) * ( 120 ) + 100;
				spr.z = 0;
				spr.width = 100;
				spr.height = 100;
				spr.name = "spr_back"+((i*3)+j);
				spr.transformGroup = group;
				spr.mask = ( (i*3+j) % 2 == 0 ) ? null : mask;
				
				layer1.displayList.addChild(spr);
			}
		}
		
		_scope.render();

	};
	
	this.progressHandler = function()
	{
		var layer = _renderer.layers[1];
		layer.context.clearRect(0,0,layer.canvas.width,layer.canvas.height);
		layer.context.fillStyle = "black";
		layer.context.fillText( _imageLoader.getProgression() + "%" , 100, 100 );
		//
	};
	
	this.render = function()
	{
		
		var context = _renderer.layers[1].context;
		var camera = _renderer.camera;
		
		if( elapsed > 999 )
		{
			_fps = _counter;
			_lastTime = time;
			_counter = 0;
		}
		
	
		
		context.fillStyle = "black";
		context.fillRect( 0, 0, 300, 20 );
		context.fillStyle = "red";
		context.font = '15px sans-serif';
		context.fillText(_fps+"fps draw: "+_renderer.numDraws+" time: "+time2,10,15);
		
		window.requestAnimationFrame( _scope.render );
	};
	
	this.init();
	
}

window.onload = function () 
{ 
	new Sample5(); 
};

window.requestAnimationFrame = (function () {

  return window.requestAnimationFrame || //Chromium 
  window.webkitRequestAnimationFrame || //Webkit
  window.mozRequestAnimationFrame || //Mozilla Geko
  window.oRequestAnimationFrame || //Opera Presto
  window.msRequestAnimationFrame || //IE Trident?

  function (callback, element) { //Fallback function
    window.setTimeout(callback, 1);
  }
 
})();